<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ page contentType="text/html;charset=UTF-8"%>
<%@ page pageEncoding="UTF-8"%>
<div class="row-fluid">
	<div class="navbar navbar-inverse">
		<div class="navbar-inner">
			<a class="brand" href="#"> <spring:message code="app.admin.asks" />
			</a>
			<ul class="nav pull-right">
				</li>
				<li><a id="navApprove" href="/admin/ask#approved"> <i
						class="icon-ok icon-white"></i> </a></li>
				<li><a id="navReject" href="/admin/ask#rejected"> <i
						class="icon-remove icon-white"></i> </a></li>
			</ul>
		</div>
	</div>
</div>
<div class="row-fluid">
	<div>
		<c:if test="${not empty items }">
			<div>
				<select id="congId">
					<c:forEach items="${congregations}" var="cong">
						<option value="${cong.id }">
							<c:out value="${cong.name}" />
						</option>
					</c:forEach>
				</select>
			</div>
			<table class="table">
				<tbody>
					<c:forEach items="${items}" var="ask">
						<tr id="${ask.id }">
							<td><c:out value="${ask.name}" escapeXml="true" /></td>
							<td><c:out value="${ask.email}" escapeXml="true" /></td>
							<td><c:out value="${ask.congregation}" escapeXml="true" />
							</td>
							<td><c:out value="${ask.phone}" escapeXml="true" /></td>
							<td><fmt:formatDate value="${ask.timestamp}" type="both"
									pattern="MMM d, yyy HH:kk" />
							</td>
							<td>

								<div class="btn-group">
									<button class="btn btn-small btn-success"
										onclick="approve('${ask.id}');return false;">
										<spring:message code="labels.approve" htmlEscape="true" />
									</button>
									<button class="btn btn-small btn-danger"
										onclick="reject('${ask.id}');return false;">
										<spring:message code="labels.reject" htmlEscape="true" />
									</button>
								</div></td>
						</tr>
					</c:forEach>
					<tr class="trbottom">
						<td colspan="6"><c:if test="${not empty np}">
								<center>
									<a id="np" href="/admin#asks?np=${np}"> <spring:message
											code="labels.more" htmlEscape="true" /> </a>
								</center>
							</c:if>
						</td>
					</tr>
				</tbody>
			</table>
			<c:if test="${not empty np}">
				<script type="text/javascript">
					require([ 'jquery', 'mustache',
							'text!templates/ask/item.html',
							'i18n!nls/messages', 'domReady!' ], function($, m,
							alTmpl, bdl) {
						function tmpl(ask) {
							if (isNaN(ask.id))
								throw "invalid data";
							return m.render(alTmpl, $.extend(ask, bdl));
						}
						$("a#np").click(
								function(e) {
									var _self = this;
									var url = $(_self).attr('href');
									url = url.replace(/#/g, '/');
									$.ajax({
										type : 'GET',
										dataType : 'json',
										url : url
									}).success(
											function(data) {
												$("tr.trbottom").before(
														function() {
															return $.map(
																	data.items,
																	tmpl).join(
																	"");
														});
												$('a#np').attr(
														'href',
														'/admin#asks?np='
																+ data.np);
											});
								});
					});
				</script>
			</c:if>
			<script type="text/javascript">
				function approve(id) {
					$.ajax({
						url : '/admin/ask/approved/' + id,
						type : 'PUT',
						dataType : 'json',
						data : 'congId=' + $('#congId').val()
					}).success(function(data) {
						$("tr#" + id).remove();
					});
				};
				function reject(id) {
					$.ajax({
						url : '/admin/ask/rejected/' + id,
						type : 'PUT',
						dataType : 'json'
					}).success(function(data) {
						$("tr#" + id).remove();
					});
				};
			</script>
		</c:if>
		<c:if test="${empty items}">
			<spring:message code="app.admin.asks" var="askLbl" />
			<spring:message code="messages.emptyList" arguments="${askLbl}" />
		</c:if>
	</div>
</div>